document.addEventListener('DOMContentLoaded', async function () {
    const signInElement = document.getElementById('govcy-sign-in');

    function getCookie(name) {
        const value = `; ${document.cookie}`;
        const parts = value.split(`; ${name}=`);
        return parts.length === 2 ? parts.pop().split(';').shift() : null;
    }

    const currentLanguage = getCookie('wp-wpml_current_language') || 'en';

    const messages = {
        en: {
            signOut: 'Sign Out',
            loginService: 'Cy Login Service',
            sessionCheckError: 'Error checking session. Please try again.',
            editProfile: 'Edit Profile',
        },
        el: {
            signOut: 'Αποσύνδεση',
            loginService: 'Υπηρεσία Cy Login',
            sessionCheckError: 'Σφάλμα κατά την έλεγχο της συνεδρίας. Παρακαλώ δοκιμάστε ξανά.',
            editProfile: 'Επεξεργασία Προφίλ',
        },
    };

    const langMessages = messages[currentLanguage] || messages.en;

    function sanitizeHTML(str) {
        const tempDiv = document.createElement('div');
        tempDiv.textContent = str;
        return tempDiv.innerHTML;
    }

    function renderSignInUI(userName) {
        if (userName == null) {
            signInElement.innerHTML = `
            <li><a href="/${currentLanguage}/cylogin-signout">${langMessages.signOut}</a></li>
        `;
        } else {
            const sanitizedUserName = sanitizeHTML(userName);
            signInElement.innerHTML = `
            <li><a href="https://cge.cyprus.gov.cy/cyloginregistration" title="${langMessages.editProfile}">${sanitizedUserName}</a></li>
            <li><span>|</span></li>
            <li><a href="/${currentLanguage}/cylogin-signout">${langMessages.signOut}</a></li>
        `;
        }
    }

    function renderLoginServiceUI() {
        signInElement.innerHTML = `<li><a href="/${currentLanguage}/cylogin-service" target="_self"><i class="govcy-signin-icon"></i>${langMessages.loginService}</a></li>`;
    }

    async function checkActiveSession() {
        try {
            const response = await fetch('/cylogin-session-check', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify({ action: 'checkSession' }),
            });

            if (!response.ok) {
                throw new Error(langMessages.sessionCheckError);
            }

            const data = await response.json();
            window.cyloginSessionData = data;

            if (!signInElement) {
                return;
            }

            if (data.activeSession) {
                renderSignInUI(data.userName);
            } else {
                renderLoginServiceUI();
            }
        } catch (error) {
            console.error('Error checking active session:', error);
            renderLoginServiceUI();
        }
    }

    await checkActiveSession();
});